<template>
  <div>
    <div class="box">
      <form action="/">
        <van-search
          v-model="value"
          show-action
          placeholder="请输入搜索关键词"
          @search="onSearch"
          @cancel="onCancel"
          action-text="查询"
        />
      </form>
    </div>
    <van-tabs v-model="active">
      <van-tab title="全部"><AorderListQb :records='records' /></van-tab>
      <van-tab title="待发货"><AorderListFh :orderFh='orderFh' /></van-tab>
      <van-tab title="待收货"><AorderListHh :orderHh='orderHh' /></van-tab>
      <van-tab title="待评论"><AorderListPl :orderPl='orderPl' /></van-tab>
    </van-tabs>
  </div>
</template>

<script>
import AorderListQb from '../components/AorderListQb'
import AorderListFh from '../components/AorderListFh'
import AorderListHh from '../components/AorderListHh'
import AorderListPl from '../components/AorderListPl'
import { orderData,orderFhData,orderHhData,orderPlData } from "../request/api";
export default {
  data() {
    return {
      value: "",
      active: 0,
      //全部
      records:[],
      //发货
      orderFh:[],
      //收获
      orderHh:[],
      //评论
      orderPl:[]
    };
  },
  methods: {
    onSearch(val) {
      Toast(val);
    },
    onCancel() {
      Toast("取消");
    },
  },
  created() {
      //全部数据请求
    orderData({
      current: "1",
      size: "30",
      keyword: "",
    }).then((res) => {
      this.records=res.data.records
    });
    //待发货数据请求
    orderFhData({
      current: "1",
      size: "30",
      keyword: "",
    }).then((res) => {
      this.orderFh=res.data.records
    });
    //待收货数据请求
    orderHhData({
      current: "1",
      size: "300",
      keyword: "",
    }).then((res) => {
      this.orderHh=res.data.records
    });
    //评论数据
    orderPlData({
      current: "1",
      size: "30",
      keyword: "",
    }).then((res) => {
      this.orderPl=res.data.records
    });
  },
  components: {
    AorderListQb,
    AorderListFh,
    AorderListHh,
    AorderListPl,
  },
};
</script>
 
<style lang = "less" scoped>
* {
  margin: 0;
  padding: 0;
  list-style: none;
}
.box .van-search[data-v-4ce8f33c] {
  background-color: #ccc;
  padding: 20px 0 0;
}
</style>